নোড(এইচটিএমএল এলিমেন্ট) যোগ করা এবং বাদ দেওয়া

নতুন এইচটিএমএল এলিমেন্ট(নোড) তৈরি

এইচটিএমএল ডোমে একটি নতুন এলিমেন্ট যোগ করার জন্যে প্রথমে অবশ্যই এলিমেন্টটি(এলিমেন্ট নোড) তৈরি করতে হবে এবং তারপর আগের এলিমেন্টের সাধে যুক্ত করতে হবে।

kt_satt_skill_example_id=1513

উদাহরণের বর্ণনা

এই কোড একটি নতুন <p> এলিমেন্ট তৈরি করেঃ

kt_satt_skill_example_id=1514

<p> এলিমেন্টে টেক্সট যোগ করার জন্য প্রথমে আপনাকে অবশ্যই একটি টেক্সট নোড তৈরি করতে হবে। এই কোড দ্বারা একটি টেক্সট নোড তৈরি করা হয়ঃ

kt_satt_skill_example_id=1515

তারপর আপনাকে অবশ্যই টেক্সট নোডকে <p> এলিমেন্টে যুক্ত করতে হবেঃ

kt_satt_skill_example_id=1516

সবশেষে আপনি আগের তৈরিকৃত একটি এলিমেন্টের সাথে নতুন এলিমেন্টটি যুক্ত করবেন।

এই কোডটি দ্বারা আগের তৈরিকৃত এলিমেন্টকে খুঁজে বের করা হয়ঃ

kt_satt_skill_example_id=1517

এই কোড আগের তৈরিকৃত এলিমেন্টে নতুন এলিমেন্ট যুক্ত করে।

kt_satt_skill_example_id=1519

নতুন এইচটিএমএল এলিমেন্ট তৈরি - insertBefore()

পূর্ববর্তী উদাহরণে appendChild() মেথডটি প্যারেন্টের শেষ চাইল্ড হিসেবে নতুন এলিমেন্ট যুক্ত করে।

আপনি যদি এটা করতে না চান তাহলে insertBefore() মেথড ব্যবহার করতে পারেনঃ

kt_satt_skill_example_id=1522

বিদ্যমান এইচটিএমএল এলিমেন্ট বাদ দেওয়া

একটি এইচটিএমএল এলিমেন্ট বাদ দেওয়ার জন্য আপনাকে অবশ্যই এলিমেন্টের প্যারেন্টকে জানতে হবেঃ

kt_satt_skill_example_id=1524

node.remove() মেথডটি ডোম ৪ এ যোগ করা হয়েছে।
কিন্তু সকল ব্রাউজারে সাপোর্ট না করার কারণে আপনারা এটি ব্যবহার করবেন না।

উদাহরণের বর্ণনা

এই এইচটিএমএল ডকুমেন্টটিতে একটি <div> এলিমেন্টে দুটি চাইল্ড নোড(দুটি <p> এলিমেন্ট) রয়েছেঃ

kt_satt_skill_example_id=1527

id= "DIV" যুক্ত এলিমেন্টটি খুঁজে বের করিঃ

kt_satt_skill_example_id=1528

id="para1" যুক্ত <p> এলিমেন্টটি খুঁজে বের করিঃ

kt_satt_skill_example_id=1529

প্যারেন্ট থেকে চাইল্ডকে বাদ দেইঃ

kt_satt_skill_example_id=1531

প্যারেন্ট এলিমেন্টকে নির্দেশ না করেই একটি এলিমেন্টকে মুছে ফেলতে খুবই।
কিন্তু দুঃখিত, এলিমেন্টটিকে বাদ দিতে হলে অবশ্যই এর প্যারেন্ট এলিমেন্টকে চিহ্নিত করে দিতে হবে।

একটি ভিন্ন পদ্ধতি দেওয়া হলোঃ

kt_satt_skill_example_id=1532

এইচটিএমএল এলিমেন্ট প্রতিস্থাপন 

এইচটিএমএল ডোমের একটি এলিমেন্টকে প্রতিস্থাপন করতে replaceChild() মেথডটি ব্যবহার করুনঃ

kt_satt_skill_example_id=1534